<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>
			postMessage - 跨域通信 - parent -
			https://developer.mozilla.org/zh-CN/docs/Web/API/Window/postMessage
		</title>
	</head>

	<body>
		<div>
			<input type="button" value="点击发送给孩子" id="btn" />

			<iframe src="./child.html" id="childIframe"></iframe>
		</div>

		<script>
			const btn = document.querySelector('#btn')
			const childIframe = document.querySelector('#childIframe')
			btn.addEventListener('click', (e) => {
				childIframe.contentWindow.postMessage('to-child1', '*')

				window.open('./child1.html')
			})

			window.addEventListener('message', (e) => {
				console.log('origin', e.origin)
				console.log('get Message', e.data)
			})
		</script>
	</body>
</html>
